<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" href="css/reset.css"/>
    <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css"/>
    <link rel="stylesheet" href="bower_components/fullpage.js/jquery.fullPage.css"/>
    <link rel="stylesheet" href="css/index.css"/>
    <link rel="stylesheet" href="css/cloud.css"/>
</head>
<body>
<div id="main">
    <div id="introHeader" class="section">
        <!--<img src="images/rocket.png" alt="rocket icon"/>-->
        <!--<img src="images/half_moon.png" alt="moon icon"/>-->
        <div class="content">
            <img class="alloyteam-logo" src="images/alloyteam.png" alt="alloyteam logo"/>
            <h2 class="title">AlloyTeam</h2>
            <p class="brief">为你提供坚实的技术平台</p>

            <?xml version="1.0" encoding="utf-8"?>
            <!-- Generator: Adobe Illustrator 16.0.4, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
            <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
            <svg  version="1.1" class="center-plane-icon" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
	 width="128px" height="128px" viewBox="0 0 128 128" enable-background="new 0 0 128 128" xml:space="preserve">
            <g>
	            <circle fill="#4CB6CF" cx="64" cy="64" r="64" opacity="0"/>
	                <path fill="#633D50" d="M106.129,52.371l-47.078,0.887c-1.596,6.558-6.292,12.01-12.417,14.63l5.191,11.02
		c1.172,2.488,4.106,3.447,6.521,2.131l48.391-26.368C109.152,53.354,108.878,52.319,106.129,52.371z"/>
	                <path fill="#FFFFFF" d="M106.43,53.992l-64.97,23.73c-2.58,0.94-3.84-0.37-2.79-2.91l5.16-12.52l-19.73-8.11
		c-2.54-1.05-2.37-1.9,0.38-1.9h81.65C108.88,52.282,109.01,53.052,106.43,53.992z"/>
            </g>
            </svg>

        </div>

        <div id="Clouds-container">
            <div id="Clouds">
                <div class="Cloud Foreground"></div>
                <div class="Cloud Background"></div>
                <div class="Cloud Foreground"></div>
                <div class="Cloud Background"></div>
                <div class="Cloud Foreground"></div>
                <div class="Cloud Background"></div>
                <div class="Cloud Background"></div>
                <div class="Cloud Foreground"></div>
                <div class="Cloud Background"></div>
                <div class="Cloud Background"></div>
                <!--  <svg viewBox="0 0 40 24" class="Cloud"><use xlink:href="#Cloud"></use></svg>-->
            </div>
        </div>







    </div><!-- End of => introHeader -->
    <div id="requirement" class="section active">
        <h2 class="title text-center">你是否有过这样的经历？</h2>
        <div class="talk left-talk talk-person1">
            <div class="dropdown">
                <div class="avatar">
                    <img src="images/student.png" alt="avatar icon"/>
                </div>
                <div class="name">迷茫的大学生</div>
            </div>
            <div class="bounce">
                <svg class="dialog-triangle" xmlns="http://www.w3.org/2000/svg" version="1.1">
                    <polygon points="24,0,8,12,24,24" fill="white"/>
                    <polygon points="24,6,16,12,24,18" fill="#50b796"></polygon>
                </svg>
                <p class="content">学了一点技术，想做做项目来增加项目经验，该怎么办？</p>
            </div>
        </div>

        <div class="talk left-talk talk-person2">
            <div class="dropdown">
                <div class="avatar">
                    <img src="images/staff.png" alt="avatar icon"/>
                </div>
                <div class="name">工作的xxx</div>
            </div>
            <div class="bounce">
                <svg class="dialog-triangle" xmlns="http://www.w3.org/2000/svg" version="1.1">
                    <polygon points="24,0,8,12,24,24" fill="white"/>
                    <polygon points="24,6,16,12,24,18" fill="#f9ad81"></polygon>
                </svg>
                <p class="content">总是埋没在需求中，都不知道怎么实际干活才好</p>
            </div>
        </div>

        <div class="talk left-talk talk-person3">
            <div class="dropdown">
                <div class="avatar">
                    <img src="images/book.png" alt="avatar icon"/>
                </div>
                <div class="name">编程爱好者</div>
            </div>
            <div class="bounce">
                <svg class="dialog-triangle" xmlns="http://www.w3.org/2000/svg" version="1.1">
                    <polygon points="24,0,8,12,24,24" fill="white"/>
                    <polygon points="24,6,16,12,24,18" fill="#c12a34"></polygon>
                </svg>
                <p class="content">我读了几本技术书，很想做做项目却不知道怎么下手好，怎么办好呢？</p>
            </div>
        </div>

        <div class="talk right-talk">
            <div class="dropdown">
                <div class="avatar">
                    <img src="images/alloyteam.png" alt="avatar icon"/>
                </div>
                <div class="name">AlloyTeam</div>
            </div>
            <div class="bounce">
                <!-----右三角------>
                <svg class="dialog-triangle" xmlns="http://www.w3.org/2000/svg" version="1.1">
                    <polygon points="0,0,16,12,0,24" fill="white"/>
                    <polygon points="0,6,8,12,0,18" fill="#323641"></polygon>
                </svg>
                <div class="content">
                    <div class="sub-title text-center">加入大AlloyTeam，我们为你解决烦恼</div>
                    <p class="description">大AlloyTeam是一个由腾讯AlloyTeam公益性的技术组织，它的宗旨是
            集结那些对编程与互联网有热情，愿意为业界贡献自己力量的成员</p>
                </div>
            </div>
        </div>



    </div> <!-- End of => requirement -->
    <div id="member" class="section">
        <h2 class="title">我们的团队</h2>
        <p class="brief">AlloyTeam是一个卓越的前端团队，推出了很多开源项目。我们的团队有很多牛逼
        的大神为你提供技术指导</p>

        <div class="members">
            <div class="section-container">
                <div class="member-item col col-sm-6">
                    <div class="content-photo">
                        <img src="images/black_man.jpg" alt="member image"/>
                    </div>
                    <div class="content-intro">
                        <h3 class="name">一个大神</h3>
                        <strong class="rank">高级前端攻城师</strong>
                        <div class="introduction">做个很多很多项目，喜欢搞开源。在什么什么方面上狠屌狠屌，业余爱好丰了个富，
                            一代男神，程序员中的战斗机</div>
                        <div class="dictum">要牛跟着我干就对了</div>
                    </div>
                </div>
                <div class="member-item col col-sm-6">
                    <div class="content-photo">
                        <img src="images/archer.jpg" alt="member image"/>
                    </div>
                    <div class="content-intro">
                        <h3 class="name">一个大神</h3>
                        <strong class="rank">高级前端攻城师</strong>
                        <div class="introduction">做个很多很多项目，喜欢搞开源。在什么什么方面上狠屌狠屌，业余爱好丰了个富，
                            一代男神，程序员中的战斗机</div>
                        <div class="dictum">要牛跟着我干就对了</div>
                    </div>
                </div>
                <div class="member-item col col-sm-6">
                    <div class="content-photo">
                        <img src="images/archer.jpg" alt="member image"/>
                    </div>
                    <div class="content-intro">
                        <h3 class="name">一个大神</h3>
                        <strong class="rank">高级前端攻城师</strong>
                        <div class="introduction">做个很多很多项目，喜欢搞开源。在什么什么方面上狠屌狠屌，业余爱好丰了个富，
                            一代男神，程序员中的战斗机</div>
                        <div class="dictum">要牛跟着我干就对了</div>
                    </div>
                </div>
                <div class="member-item col col-sm-6">
                    <div class="content-photo">
                        <img src="images/archer.jpg" alt="member image"/>
                    </div>
                    <div class="content-intro">
                        <h3 class="name">一个大神</h3>
                        <strong class="rank">高级前端攻城师</strong>
                        <div class="introduction">做个很多很多项目，喜欢搞开源。在什么什么方面上狠屌狠屌，业余爱好丰了个富，
                            一代男神，程序员中的战斗机</div>
                        <div class="dictum">要牛跟着我干就对了</div>
                    </div>
                </div>
            </div>

        </div>
    </div><!-- End of => member -->

    <div id="join" class="section">
        join
    </div>

    <div id="gallery" class="section">
        <div class="title">作品展示</div>
        <div class="work-1 image">
            <div class="info">
                <h3>AlloyImage</h3>
                <p class="description">基于多图层操作 -- 一个图层的处理不影响其他图层
                    与PS对应的17种图层混合模式 -- 便于PS处理教程的无缝迁移</p>
                <a href="#" class="info-btn">Demo</a>
            </div>
        </div>
        <div class="work-2 image">
            <div class="info">
                <h3>牛逼的项目二</h3>
                <p class="description">总之就是好牛逼~~，用过你就知道</p>
            </div>
        </div>

        <div class="work-3 image">
            <div class="info">
                <h3>另一个牛逼项目</h3>
                <p class="description">谁用谁知道呀，呵呵</p>
            </div>
        </div>

        <div class="work-4 image">
            <div class="info">
                <h3>mini项目</h3>
                <dl>
                    <dt>作者：</dt>
                    <dd>Rocky</dd>
                    <dt>团队：</dt>
                    <dd>FFF团</dd>
                    <dt>描述：</dt>
                    <dd>随便玩玩的项目，虽然很坑</dd>
                </dl>
            </div>
        </div>
    </div><!-- End of => gallery -->
    <div id="contact" class="section">
        <div class="content">
            <div class="title">立即加入</div>
            <p class="description">你想锻炼自己的web技术么？你想和其他小伙伴一起干活么？加入我们，带你装逼带你飞</p>

            <a class="contact-btn">加入<br/>我们</a>

        </div>

    </div>

</div>
<div id="navigation">
    <ul class="navigation-inner">
        <li class="nav-item">
            <a href="#"></a>
        </li>
        <li class="nav-item active">
            <div class="plane-box">
                <?xml version="1.0" encoding="utf-8"?>
                <!-- Generator: Adobe Illustrator 16.0.4, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
                <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
                <svg  version="1.1" class="current-plane-icon" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
	 width="128px" height="128px" viewBox="0 0 128 128" enable-background="new 0 0 128 128" xml:space="preserve">
            <g>
	            <circle fill="#4CB6CF" cx="64" cy="64" r="64" opacity="0"/>
	                <path fill="#633D50" d="M106.129,52.371l-47.078,0.887c-1.596,6.558-6.292,12.01-12.417,14.63l5.191,11.02
		c1.172,2.488,4.106,3.447,6.521,2.131l48.391-26.368C109.152,53.354,108.878,52.319,106.129,52.371z"/>
	                <path fill="#FFFFFF" d="M106.43,53.992l-64.97,23.73c-2.58,0.94-3.84-0.37-2.79-2.91l5.16-12.52l-19.73-8.11
		c-2.54-1.05-2.37-1.9,0.38-1.9h81.65C108.88,52.282,109.01,53.052,106.43,53.992z"/>
            </g>
            </svg>

            </div>
            <a href="#"></a>
        </li>
        <li class="nav-item">
            <a href="#"></a>
        </li>
        <li class="nav-item">
            <a href="#"></a>
        </li>
        <li class="nav-item">
            <a href="#"></a>
        </li>

    </ul>
</div>

<script src="bower_components/jquery/dist/jquery.js"></script>
<script src="bower_components/bootstrap/dist/js/bootstrap.js"></script>
<script src="bower_components/fullpage.js/vendors/jquery.easings.min.js"></script>
<script src="bower_components/fullpage.js/vendors/jquery.slimscroll.min.js"></script>
<script src="bower_components/fullpage.js/jquery.fullPage.js"></script>
<script>
    $(document).ready(function() {
       $('#main').fullpage({
           paddingTop: '10px'
       });
    });


</script>
</body>
</html>